Hello and welcome.
In this video we are going to be creating a directory and also all the hastier mail for the project.
I have already created a directory on my desktop and I've called it whack a mole.
And they were created directory just barite clicking on the desktop clicking on new folder and then
giving a tree a name.
So that's how I created my tree.
Next thing I want to do is add an hastier mail file board before I do that I added a couple of images
so if I open up the directory see I've added two images that we are going to use for the project.
Basically this is one of my more and this is going to act as the dirt or the actual More Hill.
So I grabbed these images from Google images because they are educational purposes.
Be able to get away with it if you are going to use it for anything other than educational purposes.
You need to seek the permission of the image owner.
All right so feel free to use your own images.
So now that we've got the projet directory created I have got two images in there next and I want to
do is add an hastier mail file.
I will be using this sublime text editor as my preferred tool for this project.
So this is a blank file within the editor so I'm going to save this file as my hastier mouth document
so I'm going to save it to the derrick.
We created the dough tree that already has two images so I'm going to call this specifically index.
Not huge amount but this would be my index.
Put a similar file on all quixey.
So that's the name of the file indexed or email and on the bottom right you can see says L which means
the content will be an email file.
I've already priests teach the court I am going to DHT and explain the code.
So this is the hatim old code will be used in school like one.
Here is the dog type the dog type.
If a declaration notifies the web browsers that the content of the document is and his team have five
documents lying to 35 is the height called hastier email client so online to here we've got the line.
This is just a tribute specify that it's in English and means English so we have a copperhead section
which is on line 3 to line 7 inside the headset and we've got dimitar car set with the attribute.
These are tribute concert.
It's got a value of etive Dash 8 which is the standard Unicode.
Basically we use to have paid.
I can understand most characters.
Line 5 is a title for the game.
This is a title that will appear on the title bar off the web browser.
Line 6 is a reference to the external stylesheet.
I will be using.
I have not created it yet but when I do is going to record my standard of success he can see what Hey
Treff attribute basically is used to indicate the location of the Says because I am having this here.
This file in the same directory as the hastier mail.
All I need to do is just reference the name here.
This is the end of the heading tag on my cell underbody section begins on mine 7 online 8 and end on
line 34.
Inside the body.
So any of the contents inside the body tag is the actual visible content.
You can see so inside the body.
Hey Twan head in tag.
Which would be the main title for the game.
Whack it will also have a span element and inside that span element.
I have given this plan a class of score.
So what that means is that the scoring counter for the game will be on the same line as this heading
tag.
That's why we have got a span tag and then with a button inside the bottom we've attached the.
Click methot.
So there win.
But in this clicked it would trigger a function and this function is going to trigger is called start
the game or stuck in this function.
We will create Later inside our javits group.
Now Im just attaching it to this on click it up to when they use on click.
So one clicks on the bottom it will trigger on this unclick event and that in turn will call this function
to execute the code inside the function.
And here this will be the actual text that will be displayed on the bottom saw line 13 we've got.
He did.
I'm giving this a class of game.
So this the open ended and this is closing here.
So this will help form the game container inside this class called Game.
We can have the different halls for the mall.
So there's a diagram here will form also.
This will count as one hole how or duplicate that six times to create six holes.
So each of these holes will represent the outhaul mall.
He'll have a whole one and then we've got a.
So the idea is that this glass he has called to call this is hole one.
And we also got inside that hole.
We are also created on the Deep inside inside which all we have on the deed that will contain the mall.
So the actual mall will pop out from the top.
So this mall here is what more so define inside the team.
So the idea is to get the Mall poor pout out of the hall so go.
HALL One two three four five and each of the each of them have a subclass that contains the mall.
So the idea of the game is for the more to pop out out of any of these six hall.
So he's going to randomly pop out of any of them lie.
33.
We've got a script tag here and we've got a source a tribute.
We were referencing the extent of Jarvis kreipe inside it's extempore javascript is where we'll defined
the functionality for the mom to pop out of the hall and the javascript file and create an app and call
it my script.
Jesus I have not created a yet.
When I do this is a name.
Give it notice.
Please describe.
Right.
But I meant just before the close in body type.
This is important because if you place your script too far up the page the script may execute and prevent
parts of the page from loading because all is good practice to attach this script to the just before
the closing body tag line 35 is the closing hatim on stack.
I'm just going to click on save save or and that's the hits here.
I have completed so we could take a quick look at what it looks like.
This is my directory so I'm just going to click on this email file.
I don't expect anything fancy.
You can see all it saying is this is the title.
This we form the scoring for the game later.
This is just the start button so that is it for this.
In the next logia will add some C S S to make the game look more presentable.
Thanks for watching and bye for now.